<template>
  <div class="app-container">
    <controlNumberDialog
      :form-dialog="formDialog"
      :control-number-obj="controlNumberObj"
      :old-control-number-obj="oldControlNumberObj"
      @confirmModify="confirmModify"
    />
    <selectFormDialog
      :form-dialog="formDialog"
      :select-form-obj="selectFormObj"
      :select-form-info="selectFormInfo"
      @selectFormModify="selectFormModify"
    />

    <formConDialog v-if="formDialogVisible" :form-dialog="formDialogVisible" />

    <!--顶部搜索框-->
    <el-form :inline="true" class="demo-form-inline">
      <el-form-item label="文件名称">
        <el-input
          v-model="searchForm.fileName"
          style="width: 200px"
          placeholder="请输入文件名称"
        />
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          style="margin-left: 10px"
          @click="searchFileName"
          >搜索</el-button
        >
      </el-form-item>
    </el-form>
    <!--表格-->
    <el-row>
      <el-col :span="24">
        <el-table :data="recordInfo.records" stripe>
          <el-table-column type="index" label="序号" align="center" />
          <el-table-column label="表单名称" prop="fileName" align="center" />
          <el-table-column label="源表单" prop="parentName" align="center" />
          <el-table-column label="文件控制编号" prop="fileNo" align="center" />
          <el-table-column label="操作" align="center">
            <template slot-scope="scope">
              <el-button type="text" @click="clickControlNumber(scope.row)"
                >控制编号编辑</el-button
              >
              <!--:disabled="scope.row.parentName!=null?false:true"-->
              <el-button
                :disabled="scope.row.parentName != null"
                type="text"
                @click="toFormCon(scope.row)"
                >表单配置</el-button
              >
              <el-button
                v-show="scope.row.parentName == null"
                type="text"
                @click="clickSelectForm(scope.row)"
                >选择源表单</el-button
              >
              <el-button
                v-show="scope.row.parentName != null"
                type="text"
                @click="cancelSelectForm(scope.row)"
                >取消源表单</el-button
              >
            </template>
          </el-table-column>
        </el-table>
      </el-col>
    </el-row>
    <el-pagination
      :current-page="pageData.pageNumber"
      :page-sizes="pageSizeList"
      :page-size="pageData.pageSize"
      :total="recordInfo.total"
      layout="total, sizes, prev, pager, next, jumper"
      style="text-align: right;margin-top: 20px"
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
    />
  </div>
</template>

<script>
import * as formConfigurationsServer from "@/api/system/formConfigurations";
import commonMixins from "../../../mixins/commonMixins.js";
import controlNumberDialog from "./samplingRecord/ControlNumberDialog.vue";
import selectFormDialog from "./samplingRecord/SelectFormDialog.vue";
import formConDialog from "./samplingRecord/formConDialog.vue";
export default {
  name: "SamplingRecord",
  components: { controlNumberDialog, selectFormDialog, formConDialog },
  mixins: [commonMixins],
  data() {
    return {
      // 表单配置
      formDialogVisible: false,
      // 搜索
      searchForm: {},
      // 列表数据
      recordInfo: {},
      // 点击控制编号需要传递过去的数据
      controlNumberObj: {},
      oldControlNumberObj: {},

      // 选择源表单弹框
      // 获取表单名称
      selectFormObj: {},
      // 调接口拿到的下拉框
      selectFormInfo: []
    };
  },
  watch: {
    pageData: {
      handler() {
        this.queryRecord();
      },
      deep: true
    }
  },
  created() {
    this.queryRecord();
  },
  methods: {
    // 搜索
    searchFileName() {
      this.queryRecord();
    },
    // 列表的查询
    queryRecord() {
      formConfigurationsServer
        .queryRecordApi({
          fileCode: "XC",
          ...this.searchForm,
          ...this.pageData
        })
        .then(res => {
          // console.log("query",res);
          if (res.code == 200 && res.result) {
            this.recordInfo = res.result;
          }
        });
    },
    // 点击控制编号编辑按钮函数
    clickControlNumber(row) {
      // console.log(row);
      this.formDialog.controlNumber = true;
      this.controlNumberObj = { ...row };
      this.oldControlNumberObj = { ...row };
    },
    // 点击选择源表单按钮函数
    clickSelectForm(row) {
      // console.log(row);
      this.formDialog.selectForm = true;
      this.selectFormObj = { ...row };
      formConfigurationsServer
        .querySelectFormApi({ fileCode: "XC" })
        .then(res => {
          // console.log(res.result);
          if (res.code == 200) {
            this.selectFormInfo = res.result;
            // let obj=this.selectFormInfo.find(item=>{
            //     return item.id==this.selectFormObj.parentId;
            // });
            // if (this.selectFormObj.fileName ==obj.fileName){
            //     this.selectFormObj.parentId="";
            // }
          }
        });
    },

    // 点击取消源表单按钮函数
    cancelSelectForm(obj) {
      // console.log(obj);
      formConfigurationsServer.updateSelectFormApi({ id: obj.id }).then(res => {
        if (res.code == 200) {
          this.$message({
            type: "success",
            message: "取消成功"
          });
          this.queryRecord();
        } else {
          this.$message({
            type: "success",
            message: "取消失败"
          });
        }
      });
    },

    // controlNumber弹框传递过来的数据
    confirmModify(obj) {
      formConfigurationsServer
        .updateControlNumberApi({ id: obj.id, fileNo: obj.fileNo })
        .then(res => {
          if (res.code == 200) {
            this.$message({
              type: "success",
              message: "修改成功"
            });
            this.queryRecord();
          } else {
            this.$message({
              type: "success",
              message: "修改失败"
            });
          }
        });
    },

    // 点击选择源表单修改（子组件源表单修改）
    selectFormModify(obj) {
      const selectFormObj = this.selectFormInfo.find(item => {
        return item.id == obj.parentId;
      });
      formConfigurationsServer
        .updateSelectFormApi({ id: obj.id, parentId: obj.parentId })
        .then(res => {
          // console.log(res);
          if (res.code == 200) {
            this.$message({
              type: "success",
              message: "修改成功"
            });
            this.queryRecord();
          } else {
            this.$message({
              type: "success",
              message: "修改失败"
            });
          }
        });
    },

    //  点击表单配置跳转路由
    toFormCon(row) {
      if (row.name != null) {
        let arr = row.name.split('.')
        let name = arr[0]
        window.open(
          "http://8.136.159.136:9528/" +
            "&token=" +
            this.$store.getters.token +
            "&id=" +
            row.id +
            "#/hzform/designer/" +
            name
        );
      } else {
        this.$message({
          type: "warning",
          message: "默认表单不能为空！"
        });
      }
    }
  }
};
</script>

<style scoped></style>
